<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>社医堂</title>
    <link rel="stylesheet" type="text/css" href="../../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/iconfont.css" />
</head>
<style type="text/css">
    #kk {
        border-top: solid #eee 1px;
        border-bottom: solid #eee 1px;
    }

    #kk [class*=aui-col-] {
        padding-top: 10px;
        padding-bottom: 5px;
    }

    #kk [class*=aui-col-] img {
        margin: auto;
    }

    #kk #one1 {
        width: 10%;
        padding-left: 3px;
        padding-right: 3px;
    }

    #kk #one2 {
        width: 50%;
        padding-left: 3px;
        padding-right: 3px;
    }

    #kk #one3 {
        width: 10%;
        padding-left: 3px;
        padding-right: 3px;
    }

    #kk #one4 {
        width: 10%;
        padding-left: 3px;
        padding-right: 3px;
    }

    #kk #one5 {
        width: 20%;
        padding-left: 3px;
        padding-right: 3px;
    }

    #oo {
        height: 300px;
        overflow: scroll;
        display: none;
    }

    #oo .aui-col-xs-2 {
        width: 10%;
        padding-top: 10px;
        padding-bottom: 5px;
    }

    #oo .aui-col-xs-2 img {
        margin: auto;
    }

    #jiahao {
        height: 120px;
        overflow: scroll;
        display: none;
    }

    .aui-chat .aui-chat-right .aui-chat-content {
        background-color: #24b16e;
        color: #FFF
    }

    .aui-chat .aui-chat-right .aui-chat-arrow {
        background-image: -webkit-linear-gradient(45deg, #24b16e, #24b16e 50%, transparent 50%);
        background-image: linear-gradient(45deg, #24b16e, #24b16e 50%, transparent 50%);
        -webkit-transform: rotate(-135deg);
        transform: rotate(-135deg);
        right: -0.25rem;
    }

    #showbigpic {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 999999
    }
</style>

<body>


    <section class="aui-chat">
        <div class="aui-chat-header">2021年3月16日</div>
        <span id="chatlist">
            
        </span>

    </section>

    <div id="showbigpic" style="display:none" onClick="$(this).hide()"><img style="max-width:auto" id="bigsrc" src="" />
    </div>

</body>
</html>

    <script src="../../../script/hui.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../script/hui-tab.js" type="text/javascript"></script>
    <script src="../../../script/api.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../script/stm.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../script/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../script/aui-tab.js" type="text/javascript" charset="utf-8"></script>


    <script type="text/javascript">
        apiready = function () {

            getdata(1)
            
            api.setRefreshHeaderInfo({
                visible: true,
                bgColor: 'rgba(0,0,0,0)',
                textColor: '#666',
                textDown: '下拉刷新',
                textUp: '释放刷新'
            }, function (ret, err) {
                api.refreshHeaderLoadDone();
                
            });

            var UIChatBox = api.require('UIChatBox');
            UIChatBox.open({
                placeholder: '',
                maxRows: 4,
                emotionPath: 'widget://res/img/emotion',
                texts: {
                    recordBtn: {
                        normalTitle: '按住说话',
                        activeTitle: '松开结束'
                    },
                    
                    sendBtn: {
                        title: '发送'
                    }
                },
                styles: {
                    inputBar: {
                        borderColor: '#d9d9d9',
                        bgColor: '#f2f2f2'
                    },
                    inputBox: {
                        borderColor: '#B3B3B3',
                        bgColor: '#FFFFFF'
                    },
                    emotionBtn: {
                        normalImg: 'widget://res/img/chatBox_face1.png'
                    },
                    extrasBtn: {
                        normalImg: 'widget://res/img/chatBox_add1.png'
                    },
                    keyboardBtn: {
                        normalImg: 'widget://res/img/'
                    },
                    speechBtn: {
                        normalImg: 'widget://res/img/chatBox_key1.png'
                    },
                    recordBtn: {
                        normalBg: '#c4c4c4',
                        activeBg: '#999999',
                        color: '#000',
                        size: 14
                    },
                    indicator: {
                        target: 'both',
                        color: '#c4c4c4',
                        activeColor: '#9e9e9e'
                    },
                    sendBtn: {
                        titleColor: '#00ff00',
                        bg: '#999999',
                        activeBg: '#46a91e',
                        titleSize: 14
                    }
                },
                extras: {
                    titleSize: 10,
                    titleColor: '#a3a3a3',
                    btns: [{
                        title: '图片',
                        normalImg: 'widget://res/img/chatBox_album1.png',
                        activeImg: 'widget://res/img/chatBox_album2.png'
                    }, {
                        title: '拍照',
                        normalImg: 'widget://res/img/chatBox_cam1.png',
                        activeImg: 'widget://res/img/chatBox_cam2.png'
                    }]
                }
            }, function (ret, err) {
                if (ret) {
                    if(ret.eventType=='send'){
                        post(ret.msg)
                        getnoreaddata(0)
                    }                    
                } else {
                    api.toast({msg:'发送失败',location:"top"})
                }
            });

            //监听 recordBtn 按钮 录音
            var UIChatBox = api.require('UIChatBox');
            UIChatBox.addEventListener({
                target: 'recordBtn',
                name: 'press'
            }, function (ret, err) {
                if (ret) {
                    console.log("发送内容2："+ret.msg)
                    //alert(JSON.stringify(ret))
                    //api.showProgress({title: '努力加载中...',text: '先喝杯茶...',modal: false})
                } else {
                    alert("出现错误002");
                }
            });           


            //监听 sendBtn 按钮
            var UIChatBox = api.require('UIChatBox');
            UIChatBox.addEventListener({
                target: 'sendBtn',
                name: 'press'
            }, function (ret, err) {
                if (ret) {
                    //console.log("发送内容："+ret.msg)
                    //post(ret.msg)
                    //getdata()
                    //alert(ret.msg);
                } else {
                    //JSON.stringify(err)
                    alert("出现错误001");
                }
            });

            
           

        };


        function showmsg(id){
            api.ajax({
                url: $api.getStorage('geturl')+'&c=ajaxmember&a=getuserinfo',
                method: 'post',
                data: {
                    values: {
                        userid : id
                    }
                }
            },function(ret, err){
                if (ret) {
                    if (ret.status==1) {  
                        txt = "姓名："+ret.data.person.name+"\r\n年龄："+ret.data.person.age+"\r\n健康："+ret.data.person.health+"\r\n性别："+ret.data.person.sex  
                        api.alert({title:'个人资料',msg:txt});                
                    }
                } else {
                    alert("错误码0003");
                }
            }); 
        }


        function tobottom(){
            var ele = $api.dom('body');
            //alert(ele.scrollHeight)
            //ele.scrollTop = ele.scrollHeight;
            var scrollHeight = $('body').prop("scrollHeight")+50;
            $('body').scrollTop(scrollHeight,200);
        }



        //读取消息
        function getdata(type) {
            
            api.ajax({
                url: $api.getStorage('geturl')+'&c=ajaxmember&a=getdata',
                method: 'post',
                data: {
                    values: {
                        type   : type,
                        docid  : api.pageParam.id,
                        userid : $api.getStorage('userid')
                    }
                }
            },function(ret, err){
                console.log(JSON.stringify(ret))
                if (ret) {
                    //console.log(JSON.stringify(ret))
                    if (ret.status==1) {
                        $api.append($api.byId("chatlist"),ret.tip);
                        tobottom()
                    }else{
                        console.log(ret.tip)
                        //api.toast({ msg:ret.tip,location:'top' })
                    }
                } else {
                    alert("错误码0003");
                }
            }); 
            
        }

        //读取消息
        function getnoreaddata(type) {
            
            api.ajax({
                url: $api.getStorage('geturl')+'&c=ajaxmember&a=getnoreaddata',
                method: 'post',
                data: {
                    values: {
                        type   : type,
                        docid  : api.pageParam.id,
                        userid : $api.getStorage('userid')
                    }
                }
            },function(ret, err){
                console.log(JSON.stringify(ret))
                if (ret) {
                    //console.log(JSON.stringify(ret))
                    if (ret.status==1) {
                        $api.append($api.byId("chatlist"),ret.tip);
                    }else{
                        console.log(ret.tip)
                        //api.toast({ msg:ret.tip,location:'top' })
                    }
                } else {
                    alert("错误码0005");
                }
            }); 
            
        }
        //每隔5S读取一次数据
        setInterval('getnoreaddata(0)', 10000);


        //读取消息
        function post(content,docname) {
            //alert(docname+"="+$api.getStorage('username'))
            api.ajax({
                url: $api.getStorage('geturl')+'&c=ajaxmember&a=post',
                method: 'post',
                data: {
                    values: { 
                        docid   : api.pageParam.id,
                        userid  : $api.getStorage('userid'),
                        docname : api.pageParam.parm,
                        username: $api.getStorage('username'),
                        content : content
                    }
                }
            },function(ret, err){
                console.log(JSON.stringify(ret))
                if (ret) {                    
                    if (ret.status==1) {                         
                        tobottom()
                    }else{
                        console.log(ret.tip)
                        //api.toast({ msg:ret.tip,location:'top' })
                    }
                } else {
                    alert("错误码0004");
                }
            });            
        }


//上传图片
        /*$('#upfile').on('change', function() {
            var fd = new FormData();
            fd.append("upload", 1);
            fd.append("upfile", $("#upfile").get(0).files[0]);
            var toast = new auiToast();
            toast.loading({title:"正在上传",duration:2000});
            $.ajax({
                url: "<?php echo url('api/upload');?>",
                type: "POST",
                processData: false,
                contentType: false,
                data: fd,
                success: function(d) {
                    toast.hide();
                    if(d!=0){
                        sendpost(1,d);
                    }else{
                        toast.fail({title:"上传失败",duration:2000});
                    }
                }
            });
        });*/
        /*
        function showbig(imgurl){
            $("#bigsrc").attr("src",imgurl);
            $("#showbigpic").show();
            var width = $(window).width();
            var height = $(window).height();
            var imgheight=$('#bigsrc').height(); 　   //获得当前img高度
            var imgwidth=$("#bigsrc").width();　　　　//获取当前img宽度
            $("#bigsrc").css("height",height);
            $('#bigsrc').css('marginLeft',(width-imgwidth)/2)

        }*/
    </script>

